var stompClient = null;
var flag = 0;

$('.conLeft li').on('click', function () {
    $(this).addClass('bg').siblings().removeClass('bg');
    var intername = $(this).children('.liRight').children('.intername').text();
    $('.headName').text(intername);
    $('.newsList').html('');
});

function setConnected(connected) {
    $("#connect").prop("disabled", connected);
    $("#disconnect").prop("disabled", !connected);
    if (connected) {
        $("#conversation").show();
    }
    else {
        $("#conversation").hide();
    }
    $("#notice").html("");
}

function connect() {
    var socket = new SockJS('/endpoint-webSocket');
    stompClient = Stomp.over(socket);
    stompClient.connect({}, function (frame) {
        setConnected(true);
        //订阅群聊消息
        stompClient.subscribe('/topic/chat', function (result) {
            showContent(JSON.parse(result.body));
        });
        //订阅在线用户消息
        stompClient.subscribe('/topic/onlineUser', function (result) {
            showOnlineUser(JSON.parse(result.body));
        });
    });
}

//显示实时在线用户
function showOnlineUser(body) {
    var name = body.content.split('@');
    if (flag !== name.length) {
        $("#online").html("");
        for (var i = 0; i < name.length - 1; i++) {
            $("#online").append('<li><div class="liLeft"><img src="../photo/20170926103645_21.jpg"></div><div class="liRight"><span class="intername">' + name[i] + '</span>  <span class="infor">在线</span> </div> </li>');
        }
        flag = name.length
    }
}

function showContent(body) {
    var userName= $.cookie('username');
    if (body.content.split('@')[0] !== userName) {
        answer = '<li>' +
            '<div class="nesHead"><img src="../photo/tou.jpg"/></div>' +
            '<div class="news"><img class="jiao" src="../photo/20170926103645_03_02.jpg">' + body.content + '     ' + new Date(body.time).toLocaleTimeString() + '</div>' +
            '</li>';
        $('.newsList').append(answer);
        $('.RightCont').scrollTop($('.RightCont')[0].scrollHeight);
    }
}


$(function () {
    connect();//自动上线
});


$('.sendBtn').on('click', function () {
    var news = $('#dope').val();
    if (news === '') {
        alert('不能为空');
    } else {
        $('#dope').val('');
        var str = '';
        str += '<li>' +
            '<div class="answerHead"><img src="../photo/6.jpg"/></div>' +
            '<div class="answers"><img class="jiao" src="../photo/jiao.jpg">' + news + '</div>' +
            '</li>';
        stompClient.send("/app/chat", {}, JSON.stringify({'content': news}));
        $('.newsList').append(str);
        $('.conLeft').find('li.bg').children('.liRight').children('.infor').text(news);
        $('.RightCont').scrollTop($('.RightCont')[0].scrollHeight);
    }
});

$('.ExP').on('mouseenter', function () {
    $('.facial').show();
});
$('.facial').on('mouseleave', function () {
    $('.facial').hide();
});
$('.facial li').on('click', function () {
    var imgSrc = $(this).children('img').attr('src');
    var str = "";
    str += '<li>' +
        '<div class="answerHead"><img src="../photo/6.jpg"/></div>' +
        '<div class="answers"><img class="jiao" src="../photo/20170926103645_03_02.jpg"><img class="Expr" src="' + imgSrc + '"></div>' +
        '</li>';
    $('.newsList').append(str);
    $('.facial').hide();
    $('.RightCont').scrollTop($('.RightCont')[0].scrollHeight);
});

function getUserName() {
    var userName = document.getElementById("username").value;
    $.cookie('username', userName, { expires: 7, path: ' / ' });
}